<template>
  <!--品类选择-->
  <customDrawer  title="商品品类选择" ref="customDrawerCat" :autoHide="false"     @confirm="customDrawerCatConfirm">
    <template #content>
      <treeGoodsCategory v-if="iRender"  ref="treeGoodsCategory" @click="nodeClick" :withLoad="true"/>
    </template>
  </customDrawer>
</template>

<script>
import treeGoodsCategory from '@/components/custom/bus/treeGoodsCategory.vue'

export default {
  desc: '商品分类选择',
  name: 'goodsCategoryDrawer',
  components: {
    treeGoodsCategory
  },
  props: {
    /**
     * @Description：需要设置的表单对象
     */
    form: {
      type: Object,
      default: () => {
        return {}
      }
    },
  },
  created() {
  },
  data() {
    return {
      nodeData: {},
      iRender: false
    }
  },
  methods: {
    // 节点点击后
    show() {
      this.$refs.customDrawerCat.show()
      if (!this.iRender) {
        this.iRender = true
        return
      }
      // this.$refs.treeGoodsCategory.load()
    },
    // 节点点击后
    hide() {
      this.$refs.customDrawerCat.hide()
    },
    // 节点点击后
    nodeClick(nodeData) {
      this.nodeData = nodeData
    },
    // 品类选择后
    customDrawerCatConfirm() {
      console.log('this.nodeData', this.nodeData)
      if (!this.nodeData.id) {
        this.utilMessage.warning('请选择节点')
        return
      }
      this.$set(this.form, 'catalogId', this.nodeData.id)
      this.$set(this.form, 'catalogName', this.nodeData.title)
      this.hide()
    }
  },
  watch: {
  },
  computed: {
  }
}
</script>

<style lang="scss">
</style>
